// 企业荣誉页面专用JavaScript功能

document.addEventListener('DOMContentLoaded', function() {
    // 初始化荣誉页面功能
    initHonorsTabs();
    initHonorsFilter();
    initHonorsAnimations();
    initStatsCounters();
    initTimelineAnimations();
    initPartnerHover();
});

// 荣誉分类标签功能
function initHonorsTabs() {
    const tabButtons = document.querySelectorAll('.tab-btn');
    
    tabButtons.forEach(button => {
        button.addEventListener('click', function() {
            const category = this.getAttribute('data-category');
            
            // 更新标签状态
            tabButtons.forEach(btn => btn.classList.remove('active'));
            this.classList.add('active');
            
            // 过滤荣誉内容
            filterHonors(category);
        });
    });
}

// 荣誉过滤功能
function filterHonors(category) {
    const sections = [
        { selector: '.awards-grid', category: 'awards' },
        { selector: '.certifications-grid', category: 'certifications' },
        { selector: '.partnerships-grid', category: 'partnerships' },
        { selector: '.media-grid', category: 'media' }
    ];
    
    sections.forEach(section => {
        const element = document.querySelector(section.selector);
        if (element) {
            if (category === 'all' || section.category === category) {
                element.style.display = 'grid';
                element.classList.add('visible');
                element.classList.remove('hidden');
            } else {
                element.classList.add('hidden');
                element.classList.remove('visible');
                setTimeout(() => {
                    if (element.classList.contains('hidden')) {
                        element.style.display = 'none';
                    }
                }, 300);
            }
        }
    });
}

// 荣誉动画效果
function initHonorsAnimations() {
    const observerOptions = {
        threshold: 0.1,
        rootMargin: '0px 0px -50px 0px'
    };
    
    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add('animate-in');
            }
        });
    }, observerOptions);
    
    // 观察需要动画的元素
    const animateElements = document.querySelectorAll('.award-card, .cert-card, .partner-item, .media-card, .timeline-item, .stat-card');
    animateElements.forEach(el => {
        el.classList.add('animate-element');
        observer.observe(el);
    });
}

// 统计数字动画
function initStatsCounters() {
    const statNumbers = document.querySelectorAll('.stat-content h3');
    
    const counterObserver = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                const counter = entry.target;
                const text = counter.textContent;
                const number = parseInt(text.replace(/\D/g, ''));
                const suffix = text.replace(/\d/g, '');
                
                animateCounter(counter, 0, number, suffix, 2000);
                counterObserver.unobserve(counter);
            }
        });
    }, { threshold: 0.5 });
    
    statNumbers.forEach(counter => {
        counterObserver.observe(counter);
    });
}

// 计数器动画函数
function animateCounter(element, start, end, suffix, duration) {
    const startTime = performance.now();
    
    function updateCounter(currentTime) {
        const elapsed = currentTime - startTime;
        const progress = Math.min(elapsed / duration, 1);
        
        // 使用缓动函数
        const easeOutQuart = 1 - Math.pow(1 - progress, 4);
        const current = Math.floor(start + (end - start) * easeOutQuart);
        
        element.textContent = current + suffix;
        
        if (progress < 1) {
            requestAnimationFrame(updateCounter);
        }
    }
    
    requestAnimationFrame(updateCounter);
}

// 时间线动画
function initTimelineAnimations() {
    const timelineItems = document.querySelectorAll('.timeline-item');
    
    const timelineObserver = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add('timeline-animate');
            }
        });
    }, { threshold: 0.3 });
    
    timelineItems.forEach(item => {
        timelineObserver.observe(item);
    });
}

// 合作伙伴悬停效果
function initPartnerHover() {
    const partnerItems = document.querySelectorAll('.partner-item');
    
    partnerItems.forEach(item => {
        item.addEventListener('mouseenter', function() {
            this.style.transform = 'translateY(-5px) scale(1.02)';
        });
        
        item.addEventListener('mouseleave', function() {
            this.style.transform = 'translateY(0) scale(1)';
        });
    });
}

// 奖项卡片点击效果
function initAwardCards() {
    const awardCards = document.querySelectorAll('.award-card');
    
    awardCards.forEach(card => {
        card.addEventListener('click', function() {
            // 添加点击效果
            this.style.transform = 'scale(0.98)';
            setTimeout(() => {
                this.style.transform = '';
            }, 150);
            
            // 显示详细信息（可选）
            showAwardDetails(this);
        });
    });
}

// 显示奖项详细信息
function showAwardDetails(card) {
    const title = card.querySelector('h3').textContent;
    const description = card.querySelector('p').textContent;
    const year = card.querySelector('.award-year').textContent;
    
    // 创建详细信息模态框
    const modal = createAwardModal(title, description, year);
    document.body.appendChild(modal);
    
    // 显示模态框
    setTimeout(() => {
        modal.classList.add('show');
    }, 10);
}

// 创建奖项详情模态框
function createAwardModal(title, description, year) {
    const modal = document.createElement('div');
    modal.className = 'award-modal';
    modal.innerHTML = `
        <div class="modal-overlay"></div>
        <div class="modal-content">
            <div class="modal-header">
                <h3>${title}</h3>
                <button class="modal-close">&times;</button>
            </div>
            <div class="modal-body">
                <div class="award-year-badge">${year}</div>
                <p>${description}</p>
                <div class="award-details">
                    <h4>详细信息</h4>
                    <p>该奖项是对我们在相关领域卓越表现的认可，体现了公司的技术实力和行业影响力。</p>
                </div>
            </div>
        </div>
    `;
    
    // 添加模态框样式
    const style = document.createElement('style');
    style.textContent = `
        .award-modal {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 10000;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
        }
        
        .award-modal.show {
            opacity: 1;
            visibility: visible;
        }
        
        .modal-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            backdrop-filter: blur(5px);
        }
        
        .modal-content {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%) scale(0.9);
            background: white;
            border-radius: 15px;
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
            max-width: 500px;
            width: 90%;
            max-height: 90vh;
            overflow-y: auto;
            transition: transform 0.3s ease;
        }
        
        .award-modal.show .modal-content {
            transform: translate(-50%, -50%) scale(1);
        }
        
        .modal-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 1.5rem;
            border-bottom: 1px solid #e5e7eb;
        }
        
        .modal-header h3 {
            margin: 0;
            color: var(--text-color);
            font-size: 1.3rem;
        }
        
        .modal-close {
            background: none;
            border: none;
            font-size: 1.5rem;
            cursor: pointer;
            color: #6b7280;
            padding: 0;
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            transition: all 0.3s ease;
        }
        
        .modal-close:hover {
            background: #f3f4f6;
            color: var(--text-color);
        }
        
        .modal-body {
            padding: 1.5rem;
        }
        
        .award-year-badge {
            display: inline-block;
            background: var(--gradient);
            color: white;
            padding: 0.5rem 1rem;
            border-radius: 20px;
            font-weight: 600;
            margin-bottom: 1rem;
        }
        
        .award-details {
            margin-top: 1.5rem;
            padding-top: 1.5rem;
            border-top: 1px solid #e5e7eb;
        }
        
        .award-details h4 {
            color: var(--text-color);
            margin-bottom: 0.5rem;
        }
        
        .award-details p {
            color: var(--text-light);
            line-height: 1.6;
        }
        
        @media (max-width: 480px) {
            .modal-content {
                width: 95%;
                margin: 1rem;
            }
        }
    `;
    
    if (!document.querySelector('#award-modal-styles')) {
        style.id = 'award-modal-styles';
        document.head.appendChild(style);
    }
    
    // 绑定事件
    const closeBtn = modal.querySelector('.modal-close');
    const overlay = modal.querySelector('.modal-overlay');
    
    closeBtn.addEventListener('click', closeAwardModal);
    overlay.addEventListener('click', closeAwardModal);
    
    // ESC键关闭
    document.addEventListener('keydown', function(e) {
        if (e.key === 'Escape' && modal.classList.contains('show')) {
            closeAwardModal();
        }
    });
    
    return modal;
}

// 关闭奖项模态框
function closeAwardModal() {
    const modal = document.querySelector('.award-modal');
    if (modal) {
        modal.classList.remove('show');
        setTimeout(() => {
            modal.remove();
        }, 300);
    }
}

// 认证卡片悬停效果
function initCertHover() {
    const certCards = document.querySelectorAll('.cert-card');
    
    certCards.forEach(card => {
        card.addEventListener('mouseenter', function() {
            const logo = this.querySelector('.cert-logo');
            logo.style.transform = 'scale(1.1) rotate(5deg)';
        });
        
        card.addEventListener('mouseleave', function() {
            const logo = this.querySelector('.cert-logo');
            logo.style.transform = 'scale(1) rotate(0deg)';
        });
    });
}

// 媒体报道卡片点击效果
function initMediaCards() {
    const mediaCards = document.querySelectorAll('.media-card');
    
    mediaCards.forEach(card => {
        card.addEventListener('click', function() {
            const title = this.querySelector('.media-title').textContent;
            const excerpt = this.querySelector('.media-excerpt').textContent;
            const date = this.querySelector('.media-date').textContent;
            
            // 模拟打开媒体报道链接
            showMediaDetails(title, excerpt, date);
        });
    });
}

// 显示媒体报道详情
function showMediaDetails(title, excerpt, date) {
    // 创建通知
    showNotification(`正在打开媒体报道：${title}`, 'info');
    
    // 模拟延迟后显示成功消息
    setTimeout(() => {
        showNotification('媒体报道详情已在新窗口中打开', 'success');
    }, 1500);
}

// 时间线项目点击效果
function initTimelineClick() {
    const timelineItems = document.querySelectorAll('.timeline-item');
    
    timelineItems.forEach(item => {
        item.addEventListener('click', function() {
            const year = this.querySelector('.timeline-year').textContent;
            const title = this.querySelector('h3').textContent;
            const description = this.querySelector('p').textContent;
            
            showTimelineDetails(year, title, description);
        });
    });
}

// 显示时间线详情
function showTimelineDetails(year, title, description) {
    const modal = createTimelineModal(year, title, description);
    document.body.appendChild(modal);
    
    setTimeout(() => {
        modal.classList.add('show');
    }, 10);
}

// 创建时间线详情模态框
function createTimelineModal(year, title, description) {
    const modal = document.createElement('div');
    modal.className = 'timeline-modal';
    modal.innerHTML = `
        <div class="modal-overlay"></div>
        <div class="modal-content">
            <div class="modal-header">
                <h3>${year} - ${title}</h3>
                <button class="modal-close">&times;</button>
            </div>
            <div class="modal-body">
                <p>${description}</p>
                <div class="timeline-context">
                    <h4>历史背景</h4>
                    <p>这一年是公司发展历程中的重要里程碑，标志着我们在相关领域取得了重大突破。</p>
                </div>
            </div>
        </div>
    `;
    
    // 使用相同的模态框样式
    const style = document.querySelector('#award-modal-styles');
    if (style) {
        style.textContent += `
            .timeline-modal {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                z-index: 10000;
                opacity: 0;
                visibility: hidden;
                transition: all 0.3s ease;
            }
            
            .timeline-modal.show {
                opacity: 1;
                visibility: visible;
            }
            
            .timeline-context {
                margin-top: 1.5rem;
                padding-top: 1.5rem;
                border-top: 1px solid #e5e7eb;
            }
            
            .timeline-context h4 {
                color: var(--text-color);
                margin-bottom: 0.5rem;
            }
            
            .timeline-context p {
                color: var(--text-light);
                line-height: 1.6;
            }
        `;
    }
    
    // 绑定事件
    const closeBtn = modal.querySelector('.modal-close');
    const overlay = modal.querySelector('.modal-overlay');
    
    closeBtn.addEventListener('click', closeTimelineModal);
    overlay.addEventListener('click', closeTimelineModal);
    
    return modal;
}

// 关闭时间线模态框
function closeTimelineModal() {
    const modal = document.querySelector('.timeline-modal');
    if (modal) {
        modal.classList.remove('show');
        setTimeout(() => {
            modal.remove();
        }, 300);
    }
}

// 页面加载完成后的初始化
window.addEventListener('load', function() {
    // 初始化各种交互效果
    initAwardCards();
    initCertHover();
    initMediaCards();
    initTimelineClick();
    
    // 添加页面加载完成的类
    document.body.classList.add('loaded');
    
    // 预加载关键资源
    preloadHonorsImages();
});

// 预加载荣誉页面图片
function preloadHonorsImages() {
    const imageUrls = [
        // 这里可以添加需要预加载的荣誉相关图片URL
    ];
    
    imageUrls.forEach(url => {
        const img = new Image();
        img.src = url;
    });
}

// 荣誉搜索功能（可选）
function initHonorsSearch() {
    const searchInput = document.createElement('input');
    searchInput.type = 'text';
    searchInput.placeholder = '搜索荣誉...';
    searchInput.className = 'honors-search';
    
    const searchContainer = document.querySelector('.honors-categories .container');
    if (searchContainer) {
        searchContainer.appendChild(searchInput);
        
        searchInput.addEventListener('input', function() {
            const searchTerm = this.value.toLowerCase();
            const allCards = document.querySelectorAll('.award-card, .cert-card, .media-card');
            
            allCards.forEach(card => {
                const title = card.querySelector('h3').textContent.toLowerCase();
                const description = card.querySelector('p').textContent.toLowerCase();
                
                if (title.includes(searchTerm) || description.includes(searchTerm)) {
                    card.style.display = 'block';
                } else {
                    card.style.display = 'none';
                }
            });
        });
    }
}

// 错误处理
window.addEventListener('error', function(e) {
    console.error('荣誉页面错误:', e.error);
});

// 性能监控
if ('performance' in window) {
    window.addEventListener('load', function() {
        setTimeout(() => {
            const perfData = performance.getEntriesByType('navigation')[0];
            console.log('荣誉页面加载时间:', perfData.loadEventEnd - perfData.loadEventStart, 'ms');
        }, 0);
    });
}
